<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="app">

        <div v-html="info"></div>
        <!--v-html: div.innerHTML = data.info -->

        <div v-text="info"></div>
        <!--v-text: div.innerText = data.info -->

        <hr>
        <div v-text="title"></div>
        <hr>
        <!--标签里面本来有内容，在设置v-text指令时候，会把标签内部本身的内容 覆盖-->
        <!--div.innerText = data.title-->
        <div v-text="title">标题：</div>
        <hr>
        <div v-text=" '标题：' + title"></div>
        <hr>
        <div >标题：<span v-text="title"></span></div>
        <div >标题：{{ title }}</div>
    </div>
</body>
<script src="./lib/vue.js"></script>
<script type="text/javascript">

    new Vue({
       el: '#app',

       data:{
           title: 'hi vuejs!',
           info: '<h2> 我今天学习了 vuejs</h2>'
       }
    });


</script>

</html>
